﻿<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title</title>

    <link rel="stylesheet" href="~/styles/reset.css">
    <link rel="stylesheet" href="~/styles/main.css">
    <link rel="stylesheet" href="~/styles/login.css">
    <link rel="stylesheet" href="~/styles/support.css">
    <link rel="stylesheet" href="~/styles/css/myfont.css">
    <link rel="stylesheet" href="~/styles/css/animation.css">
    <script type="text/javascript" src="~/scripts/jquery.js"></script>
    <link rel="stylesheet" href="~/scripts/bootstrap/css/bootstrap.min.css">
    <script type="text/javascript" src="~/scripts/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
	    <header class="container">
            @{var logState = Session["oauth"];
              var userName = Session["tendangnhap"];}
		    <a href="javascript:void(0);" id="logo"><h1>Home</h1></a>
		    <div class="menu-bar">
			    <div class="@logState">
                    @Html.ActionLink("Đăng nhập", "DangNhap", "TaiKhoan", null, new { @class = "menu-link login-link" })
                    <p class="greeting">Hi @userName !</p>
                    @Html.ActionLink("Đăng xuất", "DangXuat", "TaiKhoan", null, new { @class = "menu-link logout-link" })
			    </div>
		    </div>
		    <nav>
                <ul class="main-navigation @ViewBag.MenuClass">
                    <li class="navigation-item user-menu">
                        @Html.ActionLink("Thiết bị di động", "ThietBiDiDong", "SanPham", null, new { @class = "navigation-link" })
                    </li>
                    <li class="navigation-item user-menu">
                        @Html.ActionLink("Thiết bị tin học", "ThietBiTinHoc", "SanPham", null, new { @class = "navigation-link" })
                    </li>
                    <li class="navigation-item user-menu">
                        @Html.ActionLink("Hỗ trợ khách hàng", "DangKySuaChuaSanPham", "DichVuHoTro", null, new { @class = "navigation-link" })
                    </li>
                    <li class="navigation-item user-menu">
                        @Html.ActionLink("Đánh giá & Phản hồi", "DanhGia", "DanhGiaVaPhanHoi", null, new { @class = "navigation-link" })
                    </li>
                    <li class="navigation-item user-menu">
                        @Html.ActionLink("Khiếu nại", "Index", "KhieuNai", null, new { @class = "navigation-link" })
                    </li>
                    <li class="navigation-item staff-menu">
                        @Html.ActionLink("Quản lý sản phẩm", "DanhSach", "QuanLySanPham", null, new { @class = "navigation-link" })
                    </li>
                    <li class="navigation-item staff-menu">
                        @Html.ActionLink("Quản lý hỗ trợ khách hàng", "QuanLyDichVuHoTro", "QuanLyHoTroKhachHang", null, new { @class = "navigation-link" })
                    </li>
                    <li class="navigation-item staff-menu">
                        @Html.ActionLink("Quản lý khiếu nại", "DanhSach", "QuanLyKhieuNai", null, new { @class = "navigation-link" })
                    </li>
                    <li class="navigation-item staff-menu">
                        @Html.ActionLink("Quản lý thông tin khách hàng", "DanhSach", "QuanLyKhachHang", null, new { @class = "navigation-link" })
                    </li>
                    <li class="navigation-item admin-menu">
                        <a href="javascript:void(0);" class="navigation-link">Quản lý người dùng</a>
                    </li>
                    <li class="navigation-item admin-menu">
                        <a href="javascript:void(0);" class="navigation-link">Quản lý đánh giá phản hồi</a>
                    </li>
                </ul>
            </nav>
        </header>
        <div class="content container">
            @RenderBody()
        </div>
        <aside class="tagline container">
	        <div class="site-description">
   		        <p>Chúng tôi luôn mong muốn mang đến cho bạn sự thoải mái và thuận tiện. Đó là lý do vì sao chúng tôi cung cấp đến bạn những thông tin liên hệ đầy đủ nhất để bạn có thể dễ dàng liên hệ với chúng tôi khi cần trợ giúp. Chúng tôi có mặt tại đây để trợ giúp bạn, đừng ngần ngại liên hệ với chúng tôi qua điện thoại, email, chat trực tuyến hoặc ghé thăm trang web Hỗ trợ của chúng tôi<p>
            </div>
	        <div class="questions">
		        <h3>Bạn có thắc mắc? Hãy để chúng tôi giúp đỡ</h3>
		        <p>Hãy liên hệ với chúng tôi.</p>
		        <div class="support">
		            <p>Email: buianhhoa08t2@gmail.com</p>
		            <p>Điện thoại: 0979576416</p>
		        </div>
	        </div>
        </aside>

        <div class="modal fade" id="feedback-popup">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Ý kiến phản hồi</h4>
              </div>
              <div class="modal-body">
                <textarea style="resize: none; width: 100%; height: 100px" id="feedback-text"></textarea>
              </div>
              <div class="modal-footer">
                <button type="button" data-dismiss="modal" aria-hidden="true">Gửi</button>
              </div>
            </div><!-- /.modal-content -->
          </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->

        <div class="modal fade" id="answer-popup">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Trả lời</h4>
              </div>
              <div class="modal-body">
                <textarea style="resize: none; width: 100%; height: 100px" id="answer-text"></textarea>
              </div>
              <div class="modal-footer">
                <button type="button" data-dismiss="modal" aria-hidden="true">Gửi</button>
              </div>
            </div><!-- /.modal-content -->
          </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->
        <script>
            $('#feedback-popup button').click(function () {
                var self = this;

                $.ajax({
                    url: '/DichVuHoTro/PhanHoi',
                    type: "POST",
                    data: {
                        donhangid: $(self).parents('.modal').attr('data-id'),
                        phanHoi: $('#feedback-text').val()
                    }
                }).done(function (rep) {
                    $('tr[data-id=' + rep.id + ']').find('td:last-child').html(rep.text);
                });
            });

            $('#answer-popup button').click(function () {
                var self = this;

                $.ajax({
                    url: '/QuanLyHoTroKhachHang/GiaiDapThacMac',
                    type: "POST",
                    data: {
                        cauhoiid: $(self).parents('.modal').attr('data-id'),
                        traloi: $('#answer-text').val()
                    }
                }).done(function (rep) {
                    $('tr[data-id=' + rep.id + ']').find('td:last-child').html(rep.text);
                });
            });
        </script>

        <footer>
	        <div class="container">
		        <div class="col one"> 
			        <h4>SẢN PHẨM</h4>
			        <a href="javascript:void(0)">Thiết bị di động</a>
			        <a href="javascript:void(0)">Thiết bị điện gia dụng</a>
		        </div>
		        <div class="col two"> 
			        <h4>HỖ TRỢ</h4>
			        <a href="javascript:void(0)">Liên hệ</a>
			        <a href="javascript:void(0)">Hỗ trợ</a>
			        <a href="javascript:void(0)">Thuật ngữ</a>			
		        </div> 
		        <div class="col three">
			        <h4>THÔNG TIN CÔNG TY</h4>
			        <a href="javascript:void(0)">Giới thiệu</a>
			        <a href="javascript:void(0)">Thông cáo báo chí</a>
			        <a href="javascript:void(0)">Cơ hội nghề nghiệp</a>
		        </div> 
	
		        <p class="copyright">Copyright © 2013. All Rights Reserved.</p>
	        </div>
        </footer>
    </body>
    <script>
        if ('@ViewBag.ActiveIndex')
        {
            var a = '@ViewBag.ActiveIndex';
            $('.navigation-item:nth(' + a + ')').addClass('active');
        }
    </script>
</html>
